<template>
  <div class="app-container">

    <!--查询条件表单-->
    <!-- <el-form :inline="true" :model="searchPage" class="demo-form-inline">
      <el-form-item label="课程姓名">
        <el-input v-model="searchPage.name" placeholder="课程姓名"></el-input>
      </el-form-item>
      <el-form-item label="课程发布状态">
        <el-select v-model="searchPage.status" clearable placeholder="课程头街">
          <el-option label="未发布" value="Draft"></el-option>
          <el-option label="已发布" value="Normal"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="search">查询</el-button>
      </el-form-item>
    </el-form> -->
    <!--表格-->
    <el-table
      title="广告列表"
      :data="list"
      border
      sortable
      style="width: 100%">
      <el-table-column
        type="selection"
        width="40">
      </el-table-column>
      <el-table-column
        type="index"
        label="序号"
        sortable
        width="50">
      </el-table-column>

      <el-table-column
        sortable
        label="广告封面"
        width="250">
        <template slot-scope="scope">
          <img :src="scope.row.imageUrl" v-if="scope.row.cover !== ''" width="200" height="120" @click="displayImage(scope.row.cover)">
        </template>
      </el-table-column>

      <el-table-column
        sortable
        prop="title"
        label="课程标题"
        width="300">
      </el-table-column>

      <el-table-column
        prop="gmtCreate"
        label="创建时间"
        sortable
        width="200">
      </el-table-column>

      <el-table-column
        label="操作">
        <template slot-scope="scope">
          <el-button type="primary" @click="$router.push({path: `/cms/from/${scope.row.id}`})">修改</el-button>
          <el-button type="danger" @click="delCourse(scope.row.id)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-->
    <br/>
    <br/>
    <el-pagination
      @current-change="handleSizeChange"
      :page-size="page.size"
      background
      layout="prev, pager, next"
      :total="page.total">
    </el-pagination>
  </div>
</template>

<script>
import {findAllCourse, delCourse} from "../../api/course/course";
import {findByIdSubject} from "@/api/subject/subject"
import {createAd, updateAd, findByIdAd, findAllAd, delAd} from "@/api/cms/ad"


export default {
  data() {
    return {
      typeLabel: '',
      // 分页
      page: {
        current: 1,
        size: 10,
        total: 0
      },
      // 查询条件 TODO
      searchPage: {
      },
      // 列表
      list: []
    }
  },
  created() {
    this.findAll()
  },
  methods: {
    displayImage(url){
      location.href = url
    },
    // 查询全部
    async findAll() {
      let result = await findAllAd(this.page.current, this.page.size)
      this.list = result.data.records
      // 加载分页
      this.page.current = result.data.current
      this.page.size = result.data.size
      this.page.total = result.data.total
    },
    // 分页改变时
    handleSizeChange(value) {
      this.page.current = value
      this.findAll()
    },
    // 删除课程
    async delCourse(id) {
      this.$confirm('确定要删除该广告？', '提示', {
        confirmButtonText: '删除',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        let r = await delAd(id)
        if (r.code === 20000) {
          this.$message.success("删除成功!")
          // 刷新
          await this.findAll()
          return false
        }
        this.$message.error("删除失败，" + r.message)
      })
    },
  },


}
</script>
